import "./index.less";
import React, { FC, useState, useEffect, useMemo } from "react";
import { useNavigate ,useLocation} from "react-router-dom";
import { NavBar, Tabs, SearchBar, Badge } from "antd-mobile";
import CommunityProfile from "./communityProfile";
import OrganizationalStructure from "./organizationalStructure";
import DomesticAffairs from "./domesticAffairs";
const HomePage: React.FC = () => {
  const navigate = useNavigate();
  const location = useLocation();
  const type=location?.state?.type
  const [defaultActiveKey, setDefaultActiveKey] = useState<string>(type||"1")
  return (
    <div className="MyCommunity-contarnier">
      <div className="header-bg">
        <NavBar
          onBack={() => navigate("/")}
        >
          <div className="commontitle">我的社区</div>
        </NavBar>
      </div>

      <div className="MyCommunity-content">
        <div className="MyCommunity-content-imgBox">
          <img src="/images/banner@2x.png" alt="" />
        </div>
        <div className="MyCommunity-content-TabContent">
          <Tabs
            defaultActiveKey={defaultActiveKey}
            style={{ background: "#fff" }}
          >
            <Tabs.Tab
              key="1"
              title={
                <Badge
                  style={{ "--right": "-10px", "--top": "8px" }}
                >
                  社区简介
                </Badge>
              }
            >
              <CommunityProfile></CommunityProfile>
            </Tabs.Tab>
            <Tabs.Tab
              key="2"
              title={
                <Badge
                  style={{ "--right": "-10px", "--top": "8px" }}
                >
                  组织架构
                </Badge>
              }
            >
              <OrganizationalStructure></OrganizationalStructure>
            </Tabs.Tab>
            <Tabs.Tab
              key="3"
              title={
                <Badge
                  style={{ "--right": "-10px", "--top": "8px" }}
                >
                  居务公开
                </Badge>
              }
            >
              <DomesticAffairs></DomesticAffairs>
            </Tabs.Tab>
          </Tabs>
        </div>
      </div>
    </div>
  );
};

export default HomePage;
